//饼图
var dataPie1=[
	{value:0.16, name:'IPv4日均解析量'},
	{value:99.84, name:'IPv6日均解析量'}
]

function dataLegend(data){
	var dataLe=[];
	for(var i=0;i<data.length;i++){
		dataLe.push(data[i].name)
	}
	return dataLe
}
var pieOpt = function(pieData){
	var pieOption={
  	color : ["#09a7e2","#b8ff2e","#09e24b","#09e2cb","#fce24f","#f46a17","#d40d03"],
	  tooltip : {
	      trigger: 'item',
	      formatter: "{a} <br/>{b} : {c} ({d}%)"
	  },
	  legend: {
      show:true,
      left: 'left',
      bottom: 'bottom',
      textStyle :{
      	color: '#fff'
      },
      data:dataLegend(dataPie1)
	  },
	  series : [
      {
        name: '',
        type: 'pie',
        radius : ['35%','50%'],
        center: ['50%', '45%'],
        data:pieData,
        itemStyle: {
            emphasis: {
                shadowBlur: 10,
                shadowOffsetX: 0,
                shadowColor: 'rgba(0, 0, 0, 0.5)'
            }
        }
      }
	  ]
  }
  return pieOption
};
var pieChart = echarts.init(document.getElementById('IPPie'));
pieChart.setOption(pieOpt(dataPie1));

//柱状图
var data1 = [
	{ name: 'uc.com', value: 0 }, 
	{ name: '360.com', value: 0 }, 
	{ name: 'weibo.com', value: 0 }, 
	{ name: 'www.jd.com', value: 0 }, 
	{ name: 'sina.com.cn', value: 0 }, 
	{ name: 'sohu.com', value: 0 }, 
	{ name: 'tmall.com', value: 0 }, 
	{ name: 'taobao.com', value: 0 }, 
	{ name: 'baidu.com', value: 0 }, 
	{ name: 'youtube.com', value: 5076 }, 
	{ name: 'yahoo.com', value: 14118 }, 
	{ name: 'icloud.com', value: 30709 }, 
	{ name: 'qq.com', value: 420200 }, 
	{ name: 'google.com', value: 488738 },
]
//单个柱状图
var barData=function(data,key){
	var barData=[];
	for(var i=0;i<data.length;i++){
		barData.push(data[i][key])
	}
	return barData
}
//多个柱状图
function arrData(seriesData,key){
	var arrData=[];
	for(var i=0;i<seriesData.length;i++){
		arrData.push([])
		for(var j=0;j<seriesData[i].length;j++){
			arrData[i].push(seriesData[i][j][key])
		}
	}
	return arrData
}


function bar(data,direction,rotate,seriesData,axisType) {
	var axis1={
		type: 'category',
		data: barData(data,'name'),
		axisPointer: {
			type: 'shadow'
		},
		axisLabel: {
			color: '#c0d4da',
			interval: false,
			rotate: rotate,
		},
		axisLine: {
			show: true,
			lineStyle: {
				color: '#c0d4da'
			}
		}
	}
	var axis2={
			type: 'value',
//			name: '单位:亿',
			axisLabel: {
				color: '#c0d4da'
			},
			axisLine: {
				show: true,
				lineStyle: {
					color: '#c8fd6f'
				}
			},
			splitLine: {
				lineStyle: {
					color: '#272858'
				}
			}
		}
	
	var barOption = {
		color: ["#c8fd6f", "#08e2ca"],
		tooltip: {
			trigger: 'axis'
		},
		legend: {
			show: false,
			right: 'right',
			textStyle: {
				color: '#fff'
			},
//			data: ['活跃度', '终端数量']
		},
		grid: {
			top: '8%',
			left: '4%',
			right: '5%',
			bottom: '3%',
			containLabel: true
		},
		series: [{
//				name: '活跃度',
				type: 'bar',
				barWidth: '35%',
				data: barData(data,'value'),
			}
		]
	}
	if(seriesData){
		barOption.series=[]
		for(var i=0;i<seriesData.length;i++){
			axis1.data=arrData(data,'name')[0]
			barOption.series.push({
				name: seriesData[i],
				type: 'bar',
				barWidth: '35%',
				data: arrData(data,'value')[i],
			})
		}
	}
	if(axisType){
		axis2.type=axisType
		axis2.min=1
	}
	if(direction==='h'){
		barOption.yAxis=axis1
		barOption.xAxis=axis2
	}else if(direction==='s'){
		barOption.yAxis=axis2
		barOption.xAxis=axis1
	}
	
	return barOption

}
var BarChart1 = echarts.init(document.getElementById('IPBar1'));
BarChart1.setOption(bar(data1,'s',30,'','log'));

var data2=[
	{name: '河北',value: 0.93},
	{name: '重庆',value: 0.87},
	{name: '四川',value: 0.27},
	{name: '广东',value: 0.15},
	{name: '江苏',value: 0.13},
	{name: '西藏',value: 0.12},
	{name: '贵州',value: 0.05},
	{name: '新疆',value: 0.05},
	{name: '上海',value: 0.04},
	{name: '山西',value: 0.04}
]

var BarChart2 = echarts.init(document.getElementById('IPBar2'));
BarChart2.setOption(bar(data2,'s',30));

/*var data3=[
	[
		{name: '电信',value: 226246429},
		{name: '联通',value: 62229474},
		{name: '移动',value: 157359581}
	],[
		{name: '电信',value: 1135128},
		{name: '联通',value: 4034225},
		{name: '移动',value: 26858}
	]
	
]*/
var data3=[
	{name: '电信',value: 1.2},
	{name: '联通',value: 5.6},
	{name: '移动',value: 0.3}
	
]
var BarChart3 = echarts.init(document.getElementById('IPBar3'));
//BarChart3.setOption(bar(data3,'s',0,['IPv4日均解析量','IPv6日均解析量']));
BarChart3.setOption(bar(data3,'s',0));

var data5=[
	{name:'其他',value:51},
	{name:'.site',value:8},
	{name:'.xin',value:11},
	{name:'.club',value:11},
	{name:'.vip',value:11},
	{name:'.org',value:23},
	{name:'.me',value:25},
	{name:'.cc',value:31},
	{name:'.xyz',value:43},
	{name:'.net',value:55},
	{name:'.top',value:73},
	{name:'.cn',value:439},
	{name:'.com',value:889},
]
var BarChart5 = echarts.init(document.getElementById('IPBar5'));
BarChart5.setOption(bar(data5,'s',0,'','log'));

var data6=[
	{name:'广西',value:4},
	{name:'青海',value:7},
	{name:'西藏',value:8},
	{name:'陕西',value:9},
	{name:'天津',value:10},
	{name:'宁夏',value:11},
	{name:'吉林',value:12},
	{name:'内蒙古',value:13},
	{name:'山东',value:14},
	{name:'贵州',value:14},
	{name:'甘肃',value:14},
	{name:'江西',value:16},
	{name:'新疆',value:18},
	{name:'四川',value:18},
	{name:'湖北',value:19},
	{name:'云南',value:20},
	{name:'重庆',value:20},
	{name:'河南',value:20},
	{name:'山西',value:22},
	{name:'海南',value:23},
	{name:'辽宁',value:24},
	{name:'广东',value:30},
	{name:'浙江',value:31},
	{name:'福建',value:31},
	{name:'江苏',value:33},
	{name:'河北',value:38},
	{name:'北京',value:39},
	{name:'湖南',value:45},
	{name:'黑龙江',value:53},
	{name:'安徽',value:57},
	{name:'上海',value:91},
]
var BarChart6 = echarts.init(document.getElementById('IPBar6'));
BarChart6.setOption(bar(data6,'h',0));

var data7=[
	{name:'电信',value:390},
	{name:'联通',value:265},
	{name:'移动',value:94}
]
var BarChart7 = echarts.init(document.getElementById('IPBar7'));
BarChart7.setOption(bar(data7,'s',0));

var data8=[
	{name:'重庆',value:1752786},
	{name:'河北',value:88777},
	{name:'广东',value:71390},
	{name:'陕西',value:66815},
	{name:'四川',value:69640},
	{name:'上海',value:56802},
	{name:'山西',value:20495},
	{name:'江苏',value:19163},
	{name:'贵州',value:9264},
	{name:'西藏',value:9025},
	{name:'新疆',value:8741},
	{name:'湖北',value:3312},
	{name:'云南',value:714},
	{name:'北京',value:4},
	{name:'其他',value:0},
]
var BarChart8 = echarts.init(document.getElementById('IPBar8'));
BarChart8.setOption(bar(data8,'s',60,'','log'));

var data9=[
	[
		{name:'河北',value:326922},
		{name:'重庆',value:6847904},
		{name:'四川',value:814832},
		{name:'广东',value:1681400},
		{name:'江苏',value:513557},
		{name:'西藏',value:513557},
		{name:'贵州',value:648608},
		{name:'新疆',value:592972},
		{name:'上海',value:4714277},
		{name:'山西',value:1719050}
	],[
		{name:'河北',value:3061},
		{name:'重庆',value:60440},
		{name:'四川',value:2239},
		{name:'广东',value:2461},
		{name:'江苏',value:660},
		{name:'西藏',value:311},
		{name:'贵州',value:319},
		{name:'新疆',value:301},
		{name:'上海',value:1958},
		{name:'山西',value:706}
	]
]
var BarChart9 = echarts.init(document.getElementById('IPBar9'));
BarChart9.setOption(bar(data9,'s',0,['IPv4日均解析量','IPv6日均解析量'],'log'));

window.addEventListener("resize", function() {
	BarChart1.resize();
	BarChart2.resize();
	pieChart.resize();
	BarChart3.resize();
	BarChart5.resize();
	BarChart6.resize();
	BarChart7.resize();
	BarChart8.resize();
	BarChart9.resize();
	
});